import React, { Component } from 'react'
import Input from './components/Input'
import {createForm} from 'rc-form'

const nameRules = {requires:true, message:'请输入姓名'}

@createForm() //加上装饰器后，props里面就生成一个form对象，具备Form提供的各种方法和属性了
class Index extends Component {
    constructor(props) {
        super(props)
    }
    componentDidMount(){
        const {setFieldsValue} = this.props.form
        setFieldsValue({username:'daoke',password:'123'})
    }
    submit() {
        const {getFieldsValue,getFieldValue} = this.props.form
        console.log('~~rc-form提交信息', getFieldsValue(), getFieldValue('username'), getFieldValue('password') )
    }
    render() {
        const {getFieldDecorator} = this.props.form
        return (
            <div>
                {getFieldDecorator('username',{rules:[nameRules]})(
                    <Input placeholder='请输入用户名'/>
                )}
                {getFieldDecorator('password')(
                    <Input placeholder='请输入密码' type='password'/>
                )}
                <button onClick={()=>this.submit()}>submit</button>
            </div>
        );
    }
}

export default Index;
